<html>
    <head>
        <meta charset="UTF-8">
        <script src="./js/jquery-3.6.0.min.js" type="text/javascript"></script>
        <title></title>
    </head>
    <style type="text/css">
        .main{ width: 500px;height: 400px;border:solid 2px;float: left;}
        label{width: 80px;font-size: 20px;}
        .native{margin-left: 10px;}
        .user{margin-left: 10px;}
        .password{margin-left: 10px;}
        .list{width: 530px;height: 400px;margin-top: 30px;}
    </style>
    <script type="text/javascript">
    $(function(){
    $(":submit").click(function() {
        alert("input标签的数量为:"+$("input:input").length+
        "单行文本框的数量为:"+$("input:text").length+
        "密码框的数量为:"+$("input:password").length+
        "单选按钮的数量为:"+$("input:radio").length+
        "上传文本域的数量为:"+$("input:file").length+
        "复选框的数量为:"+$("input:checkbox").length+
        "提交按钮的数量为:"+$("input:submit").length+
        "普通按钮的数量为:"+$("input:reset").length);
    })
})
    </script>
    <body>
        <form>
            <div class="main">
            <div class="list">
            <label>账&nbsp;&nbsp;&nbsp;&nbsp;号：</label>
            <input type="text" name="native" id="native"/><br>
            <label>用户名：</label>
            <input type="text" name="user" id="name"/><br>
            <label>密&nbsp;&nbsp;&nbsp;&nbsp;码：</label>
            <input type="password" name="password" id="password"/><br>
            爱&nbsp;&nbsp;&nbsp;&nbsp;好：<input type="radio" name="单选按钮" value="1">音乐 
                                          <input type="radio" name="单选按钮" value="2">舞蹈 
                                          <input type="radio" name="单选按钮" value="3">足球 
                                          <input type="radio" name="单选按钮" value="4">游戏<br>
            资料上传：<input type="file"><br>
            热销产品：<input type="checkbox" name="复选框" value="1">美白滋养霜
                     <input type="checkbox" name="复选框" value="2">美白润体乳
                     <input type="checkbox" name="复选框" value="3">美白面膜
                     <input type="checkbox" name="复选框" value="4">美白柔肤水<br>
            <input type="submit" name="" value="提交">
            <input type="reset" name="重置" value="重置">
            </div>
         </div>
        </form>
    </body>
    
</html>